<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>vue-sk-button</title>
  <link rel="stylesheet" href="./index.css">
</head>

<body>
  <script src='https://unpkg.com/vue@2.2.6'></script>
  <script src="../dist/vue-sk-button.min.js"></script>
  <div id="app">
    <template>
      <h1>Vue SkButton</h1>
      <div>
        <sk-button :loading="loading" style-type="3d" type="warning" size="default">查 询</sk-button>

        <sk-button style="margin-left: 20px;" style-type="3d" type="danger" size="small" @click="btnfn">toggle loading</sk-button>
      </div>

    </template>
  </div>
  <script>
    var Main = {
      name: 'test',
      data() {
        return {
          loading: false,
        }
      },
      methods: {
        btnfn(){
          this.loading = !this.loading
        }
      }
    };
    var Ctor = Vue.extend(Main)
    new Ctor().$mount('#app')
  </script>
</body>

</html>
